.conter{
    width: 100%;
    height: 100%;


    .search{
        
        width: 100%;
        
        display: flex;

        // flex-direction: row;
        flex-wrap: nowrap;
        padding: 10rpx 20rpx;
        background-color: #fff;
        .site{
            text-align: center;
            font-size: 24rpx;
            width: 160rpx;
            padding: 0 8px;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;         

        }
        .searchConter{
            width: 70%;
            background-color: rgb(236, 236, 236);
            display: flex;
            justify-content: center;
            border-radius: 80rpx;

            input{
                width: 100%;
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
            }
            i{
                margin-left: 20rpx;
                text-align: center;
                margin-top: 5rpx;
            }

        }

    }
    .swContainer{
        width: 100%;
        height: 417rpx;
     
        .sw{
            width: 100%;
            height: 100%;

            .swItem{
                width: 100%;
                height: 100%;                
                
                .swImage{
        
                   
                    width: 100%;

                }
            }
        }
    }
    
    .channel{
        border: 2px solid #dbdbdb;
        width: 100%;
        overflow: hidden;
        background-color: rgb(255, 255, 255);
        padding: 20rpx 0;
        display: flex;
        justify-content: space-around;
        .channelContent{
            text-align: center;
            flex:1;
            height: 100%;
            width: 100%;
            // flex: 1 1;
         img{
            
            width: 58rpx;
            height: 58rpx;

         }
         .channelTitle{
             text-align: center;

         }   
        }
    }
    .brand{
        margin-top: 10rpx;
        background-color: #fff;
        .headline{
            text-align: center;
            font-size: 30rpx;
            padding: 45rpx 0;
            font-weight: 600;
        }
        .brandBox{
            margin: 0 auto;
            width: 730rpx;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
            .brandItem{
                margin-bottom: 5rpx;
                position: relative;
                width: 360rpx;
                height: 235rpx;
                
                img{
                    width: 360rpx;
                    height: 100%;
                }
                .itemFont{
                    .brandName{
                        font-weight: 600;
                        font-size: 25rpx;
                    }
                    position: absolute;
                    top: 0;
                    left: 0;
                    padding: 10rpx;
                }
    
            }
        }
    }
    .newTopics{
        width: 100%;
        .headline{
            display: flex;
            flex-direction: column;
            justify-content: center;
            height: 260rpx;
            margin-top: 20rpx;
            background: url('../../../static/images/bgnew.png');
            background-size: 100% 100%;
            text-align: center;
            p{
                color: rgb(203, 230, 230);
            }
            p:nth-child(1){
                font-size: 36rpx;
                font-weight: bolder;
            }
            p:nth-child(2){
                margin: 27rpx auto 0 auto;
                font-size: 22rpx;
                width: 180rpx;
                height: 50rpx;
                line-height: 50rpx;
                background-color: rgb(139, 158, 158);
            }



        }
        .topicesItem{
            width: 100%;

            scroll-view{
                width: 100%;
                white-space: nowrap;
                li{
                    width: 280rpx;
                    height: 419rpx;
                    background-color: #fff;
                    display: inline-block;
                    border-right: 1rpx solid #d8d8d8;
                    p{
                        white-space: nowrap;
                        text-overflow: ellipsis;
                        overflow: hidden;
                        width: 94%;
                        margin-top: 8rpx;
                        text-indent: 1em;
                    }

                    img{
                        width: 280rpx;
                        height: 280rpx;
                    }
                    p:nth-child(2){
                        font-size: 30rpx;
                        font-weight: bold;

                    }
                    p:nth-child(3){
                        font-size: 24rpx;
                        color:#8a8a8a
                    }
                    p:nth-child(4){
                        font-size: 24rpx;
                        color: #9c3232;
                    }
                }
            }

        }
    }
    .topSale{
        .headline{
            background: url('../../../static/images/bgtopic.png');
            p:nth-child(1){
                color: #9c3232;
            }
            p:nth-child(2){
                color: #9c3232;
                background-color:  #c0b2b2;
            }
        }
    }

    .exquisite{
        margin-top: 20rpx;
        background-color: #fff;
        width: 100%;
        .headline{
            padding: 45rpx 0;
            p{
                font-weight: bold;
                display: inline-block;
                margin-right: 10rpx;
            }
            img{
                vertical-align: middle;
                width: 32rpx;
                height: 32rpx;
            }
            text-align: center;
        }
        &-content{
            width: 100%;
            .box{
                width: 100%;
                
                
                scroll-view{
                    width: 100%;
                    
                    white-space: nowrap;
                    .excontent{
                        margin-left: 20rpx;

                        width: 575rpx;
                        height: 325rpx;
                        display: inline-block;


                        .imgBox{
                             margin: 0 0 40rpx 10rpx;

                            border-radius: 50rxp;

                            img{
                                border-radius: 10rpx;
                                display: block;
                                width: 575rpx;
                                height: 325rpx;
                            }
                        }
                        .extitle{
                            width: 100%;
                            .st{
                                margin-bottom: 10rpx;
                                display: flex;
                                justify-content: space-between;
    
                                .st-title{
                                    font-weight: bold;
    
                                }
                                .st-price{
                                    color:rgb(211, 149, 149)
                                }
                            }
                            .exquisitedrief{
                                display: inline-block;
                                font-size: 20rpx;
                                
                                width: 95%;
                                padding: 0 10rpx;
                                overflow: hidden;
                                white-space: nowrap;
                                text-overflow: ellipsis;
                            }
                          
    
                        }
                        &:nth-last-child(1){
                            margin-right: 40rpx;
                        }
                    }
                }
            }
        }

    }
    .categoryGoods{
        width: 100%;
        &-headline{
            font-size: 35rpx;
            text-align: center;
            padding: 40rpx 0;
            font-weight: bold;
            
        }
        margin-top: 20rpx;
        &-box{
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            justify-content: space-between;
            padding: 0 5rpx;
            .categoryGoodscontent{
                margin: 0 10rpx 10rpx 0;
                width: 360rpx;
                background-color: #fff;
                .categoryImg{
                     text-align: center;
                    
                    img{
                        width: 302rpx;
                        height: 302rpx;
                        margin: 0 auto;                        
                    }
                }
                span:nth-child(2){
                    display: inline-block;
                    margin-left: 15rpx;
                    margin-bottom: 15rpx;
                    width: 95%;
                    font-weight:600;
                }
                .categoryPirce{
                    margin-left: 15rpx;
                    margin-bottom: 15rpx;
                    width: 95%;
                    font-weight:500;
                    font-size: 25rpx;
                    color: rgb(211, 149, 149);
                }

            }
            margin-top: 20rpx;
            .mark{
                text-align: center;
                margin: 0 10rpx 10rpx 0;
                position: relative;
                width: 360rpx;
                background-color: #fff;
                &-img{
                    position: absolute;
                    left: 50%;
                    top: 50%;
                    transform:translate(-50%,-50%);
                    width: 70rpx;
                    height: 70rpx;
                    background: url('../../../static/images/rightbig.png') no-repeat;
                    background-size: 100% 100%;
                }
                &-title{
                    display: block;
                    margin-top: 80rpx;
                    font-size: 40rpx;
                    font-weight: bold;
                }


            }
        }

    }





}